<template>
  <div>
    <!--    首页-->
    <a-descriptions title="基本信息:">
      <a-descriptions-item label="运单编号:">
        <b> {{ transportOrderDetailsData.id }}</b>
      </a-descriptions-item>
      <a-descriptions-item label="订单编号">
        <b>{{ transportOrderDetailsData.orderId }}</b>
      </a-descriptions-item>
      <a-descriptions-item label="运单状态">
        <b v-if="Number(transportOrderDetailsData.status)==1">新建</b>
        <b v-if="Number(transportOrderDetailsData.status)==2">已装车</b>
        <b v-if="Number(transportOrderDetailsData.status)==3">到达</b>
        <b v-if="Number(transportOrderDetailsData.status)==4">到达终点</b>
        <b v-if="Number(transportOrderDetailsData.status)==5">已签收</b>
        <b v-if="Number(transportOrderDetailsData.status)==6">拒收</b>
      </a-descriptions-item>
      <a-descriptions-item label="调度状态">
        <b v-if="Number(transportOrderDetailsData.schedulingStatus)==1">新建</b>
        <b v-if="Number(transportOrderDetailsData.schedulingStatus)==2">待调度</b>
        <b v-if="Number(transportOrderDetailsData.schedulingStatus)==3">已调度</b>
      </a-descriptions-item>
      <a-descriptions-item label="下单时间">
        <b>{{ transportOrderDetailsData.createTime }}</b>
      </a-descriptions-item>

      <a-descriptions-item label="收件人姓名">
        <b>{{ transportOrderDetailsData.order.receiverName }}</b>
      </a-descriptions-item>

      <a-descriptions-item label="收件人电话">
        <b>{{ transportOrderDetailsData.order.receiverPhone }}</b>
      </a-descriptions-item>

      <a-descriptions-item label="收件人地址">

        <b>{{ transportOrderDetailsData.order.receiverAddress }}</b>

      </a-descriptions-item>

      <a-descriptions-item label="发件人姓名">

        <b>{{ transportOrderDetailsData.order.senderName }}</b>

      </a-descriptions-item>

      <a-descriptions-item label="发件人电话">
        <b>{{ transportOrderDetailsData.order.senderPhone }}</b>

      </a-descriptions-item>

      <a-descriptions-item label="发件人地址">
        <b>{{ transportOrderDetailsData.order.senderAddress }}</b>
      </a-descriptions-item>
    </a-descriptions>

    <br/>
    <br/>

    <!--    折叠面板-->
    <el-collapse>
      <el-collapse-item title="线路信息:" name="3">
        <!--        当线路信息存在时显示-->
        <a-descriptions
          v-if="transportOrderDetailsData.transportLineDto&&transportOrderDetailsData.transportLineDto!==null"
        >
          <a-descriptions-item label="线路名称:">
            <b>{{ transportOrderDetailsData.transportLineDto.name }}</b>
          </a-descriptions-item>

          <a-descriptions-item label="线路编号:">
            <b>{{ transportOrderDetailsData.transportLineDto.lineNumber }}</b>

          </a-descriptions-item>


          <a-descriptions-item label="距离:">
            <b>{{ transportOrderDetailsData.transportLineDto.distance }}</b>

          </a-descriptions-item>


          <a-descriptions-item label="成本:">
            <b>{{ transportOrderDetailsData.transportLineDto.cost }}</b>

          </a-descriptions-item>
        </a-descriptions>

        <el-button type="primary" v-else @click="transportAllocation">分配线路</el-button>
      </el-collapse-item>

      <el-collapse-item title="车次信息:" name="4">
        <a-descriptions
          v-if="transportOrderDetailsData.transportTripsDto&&transportOrderDetailsData.transportTripsDto!==null"
        >
          <a-descriptions-item label="车次名称:">
            <b>{{ transportOrderDetailsData.transportTripsDto.name }}</b>
          </a-descriptions-item>

          <a-descriptions-item label="发车时间:">
            <b>{{ transportOrderDetailsData.transportTripsDto.departureTime }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="所属线路:">
            <b>{{ transportOrderDetailsData.transportLineDto.name }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="周期:">
            <b v-if="transportOrderDetailsData.transportTripsDto.period==1">天</b>
            <b v-if="transportOrderDetailsData.transportTripsDto.period==2">周</b>
            <b v-if="transportOrderDetailsData.transportTripsDto.period==3">月</b>

          </a-descriptions-item>

        </a-descriptions>
        <el-button type="primary" v-else @click="transportAllocation">分配车次</el-button>
      </el-collapse-item>

      <el-collapse-item title="车辆信息:" name="5">
        <a-descriptions v-if="transportOrderDetailsData.truckDto&&transportOrderDetailsData.truckDto!==null">
          <a-descriptions-item label="所属车队:">
            <b>{{ transportOrderDetailsData.truckDto.fleetName }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="品牌:">
            <b>{{ transportOrderDetailsData.truckDto.brand }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="车牌号码:">
            <b>{{ transportOrderDetailsData.truckDto.licensePlate }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="GPS设备id:">

            <b>{{ transportOrderDetailsData.truckDto.deviceGpsId }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="准载重量:">
            <b>{{ transportOrderDetailsData.truckDto.allowableLoad }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="准载体积:">
            <b>{{ transportOrderDetailsData.truckDto.allowableVolume }}</b>

          </a-descriptions-item>

        </a-descriptions>

        <el-button type="primary" v-else @click="transportAllocation">分配车辆</el-button>

      </el-collapse-item>

      <el-collapse-item title="司机信息:" name="6">
        <a-descriptions
          v-if="transportOrderDetailsData.truckDriverDto&&transportOrderDetailsData.truckDriverDto!==null"
        >
          <a-descriptions-item label="司机名称:">
            <b>{{ transportOrderDetailsData.truckDriverDto.name }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="所属车队:">
            <b>{{ transportOrderDetailsData.truckDriverDto.fleetName }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="年龄:">
            <b>{{ transportOrderDetailsData.truckDriverDto.age }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="驾龄:">
            <b>{{ transportOrderDetailsData.truckDriverDto.drivingAge }}</b>

          </a-descriptions-item>

          <a-descriptions-item label="司机照片:">
            <b>{{ transportOrderDetailsData.truckDriverDto.picture }}</b>

          </a-descriptions-item>
        </a-descriptions>

        <el-button type="primary" @click="transportAllocation" v-else>分配司机</el-button>

      </el-collapse-item>
    </el-collapse>
  </div>
</template>

<script>
import transportOrder from '@/api/work/transportOrder'

export default {
  name: 'transportOrderDetails',
  data() {
    return {
      transportOrderDetailsData: {},
      transportOrderId: '',
      orderId:''
    }
  },
  methods: {
    transportAllocation() {
      this.$router.push({ path: '/work/transport-allocation/' + this.orderId })
    },
    findTransportOrderDetailsById(id) {
      transportOrder.findTransportOrderDetailsById(id).then(data => {
        this.transportOrderDetailsData = data.data
        this.orderId=data.data.orderId;
      }).catch(e => {
      })
    }
  }, mounted() {
    if (this.$route.params && this.$route.params.id) {
      this.transportOrderId = this.$route.params.id
      this.findTransportOrderDetailsById(this.transportOrderId)
    }

  }
}
</script>

<style scoped>

</style>
